<template>
  <div>
    <h1>This is HOME</h1>
    <input v-model="s" />
    <button @click="beginSearch">go</button>
  </div>
</template>

<script setup lang="ts">
import { ref, watchEffect } from "vue";
import { useRoute, useRouter } from "vue-router";

const router = useRouter();
const route = useRoute();
const s = ref("");
function beginSearch() {
  router.replace({ query: { search: s.value } });
}

watchEffect(() => {
  if (route.query?.search) {
    console.log("加载 " + route.query?.search);
    s.value = route.query?.search as string;
  }
});
</script>

<style scoped></style>
